﻿@theme: "../refs/";
@import "@{theme}variables.less";
@import "@{theme}mixins.less";

.product-item {
    .picture {
        width: 210px;
        height: 250px;
        border: 1px solid darken(@gray-lighter,10%);

        img {
            width: 200px;
            height: 238px;
            margin: 6px 5px;
        }

        &:hover {
            border-color: @gray;
            .box-shadow(0px 0px 8px @gray);
            .transition(border 0.8s ease-in-out 0.3s);
            .transition(box-shadow 0.3s ease-in-out 0s);
        }
    }

    .details {
        padding: 10px 10px 0;
        border-left: 1px solid #eee;
        border-right: 1px solid #eee;
        border-bottom: 1px solid #d9d9d9;
        background-color: #fff;
        overflow: hidden;
        height: 130px;

        .product-title {
            font-size: @font-size-small;
            height: 30px;
            margin: 0;
            line-height: 1.2em;
        }
    }

    .product-rating-box {
        padding: 5px 0;
    }

    .add-info {
        padding: 0 0 8px;

        .prices {
            padding-bottom: 5px;
        }

        .price {
            font-size: @font-size-base;
            color: @brand-primary;
            text-decoration: none;
            font-family: Arial, Helvetica, sans-serif;
            font-weight: bold;
        }

        .old-price {
            margin-right: 16px;
            text-decoration: line-through;
        }

        .actual-price {
        }
    }
}

.product-simple-box {
    .picture {
        img {
            // max Product thumbnail image size (catalog): 238px;
            width: 200px;
            height: 238px;
        }
    }
}

.product-activity-box {


    .picture {
        width: 155px;
        height: 182px;

        img {
            width: 143px;
            height: 170px;
        }
    }

    .details {
        height: 26px;
        padding-top: 2px;
        padding-bottom: 0;

        .price {
            font-size: 17px;
        }
    }
}

.acvitity-category-box {
    position: relative;

    .discount-percent {
        color: white;
        font-size: 15px;
        position: absolute;
        display: block;
        top: 2px;
        left: 2px;
        background: @brand-success;
        height: 20px;
        width: 100px;
    }
}
